<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>详情页</title>
  <link rel="stylesheet" href="../css/public.css">
  <link rel="stylesheet" href="../css/detail.css">
</head>

<body>

  <div class="menu">
    <!-- 公共头部开始 -->
    <div class="header">
      <ul>
        <li class="l1">
          首页
        </li>
        <li class="l2">
          商场
        </li>
        <li class="l3">
          我的订单
        </li>
        <li class="l4">
          关于我们
        </li>
      </ul>
    </div>
    <!-- 线 -->
    <div class="heng"></div>
    <!-- 搜索框 -->
    <div class="search">
      <img src="../images/1.png" alt="">
      <div class="list">
        <span>
          <i></i>
          目录
        </span>
        <div class="selist">
          <div class="mark">
            <div>
              <span class="s1">主题市场</span>
            </div>
            <ul>
              <li>上衣</li>
              <li>裙装</li>
              <li>裤子</li>
              <li>女鞋</li>
              <li>美妆</li>
              <li>包包</li>
              <li>配饰</li>
              <li>内衣</li>
              <li>男友</li>
              <li>母婴</li>
              <li>家居</li>
              <li>食品</li>
            </ul>
          </div>
          <div class="hot">
            <div>
              <span class="s1">热门品牌</span>
              <span class="s2">全部品牌 > </span>
            </div>
            <ul>
              <li>CHANEL</li>
              <li>SICLY西西里</li>
              <li>DREAM TREND</li>
              <li>夏梵尼</li>
              <li>御泥坊</li>
              <li>衣阁里拉</li>
              <li>美康粉黛</li>
              <li>URBAN REVIVO</li>
              <li>new balance</li>
            </ul>
          </div>
          <div class="popular">
            <div>
              <span class="s1">流行话题</span>
              <span class="s2">全部话题 > </span>
            </div>
            <ul>
              <li>#怎么多拿压岁钱？穿的"嫩"啊！#</li>
              <li>#十月最强套装攻略，穿到冬天#</li>
              <li>#小长假倒计时，明天上班穿这套！#</li>
              <li>#手把手教你化秋日暖冬装#</li>
              <li>#国庆七日穿搭打卡计划#</li>
              <li>#西装+裙子=2019最火情侣档#</li>
            </ul>
          </div>
        </div>
      </div>
      <div class="box">
        <input type="text">
        <button>
        </button>
        <ul>
          <li>1</li>
          <li>2</li>
          <li>3</li>
          <li>4</li>
          <li>5</li>
          <li>6</li>
          <li>7</li>
          <li>8</li>
          <li>9</li>
          <li>10</li>
        </ul>
      </div>
      <ul>
        <li class="l1">
          消息
        </li>
        <li class="l2">
          收藏
        </li>
        <li class="l3">
          <a href="../views/cart.html">购物车</a>
        </li>
        <li class="l4">
          下载app
        </li>
        <div class="twowet">
          <img src="../images/4.jpg" alt="">
          <span>扫一扫 加我</span>
        </div>
      </ul>


      <!-- 个人信息部分 -->
      <div class="info">
        <!-- 登陆状态 -->
        <div class="on">
          <img src="../images/3.jpg" alt="">
          <span class="username">靠自己je23rl</span>
          <ul>
            <li class="cart">
              <a href="../views/cart.html">我的订单</a>
            </li>
            <li class="self">个人设置</li>
            <li class="logout">退出</li>
          </ul>
        </div>
        <!-- 未登录状态 -->
        <div class="off active">
          <img src="https://s10.mogucdn.com/mlcdn/c45406/181016_143l3ehl4ebad6c2326gjk6d4h41g_48x48.png" alt="">
          <a href="../views/login.html">您好，请登录</a>
        </div>
      </div>


    </div>
    <!-- 右侧导航栏 -->
    <div class="rigsid">
      <img src="../images/3.jpg" alt="">
      <ul>
        <li>首页</li>
        <li>优惠券</li>
        <li>钱包</li>
        <li>客户服务</li>
        <li>商家后台</li>
      </ul>
      <span id="myBtn">
        <p></p>
      </span>
    </div>
    <!-- 公共头部结束 -->
  </div>







  <!-- 详情页 -->
  <div class="shop_detail">
    <div class="content container">
      <div class="left">
        <img src="" alt="">
      </div>
      <div class="right">
        <p class="title">漂亮女人的天堂，蘑菇街的各种该系列，美衣美裙美鞋，帅气又时尚的各种单品百搭显气质</p>
        <button class="call_me">客服：请联系客服</button>
        <p class="goods_number">商品数量：100</p>
        <p class="price">
          ￥ 100.00
        </p>
        <p class="number">
          <button>-</button>
          <input type="text" value="1">
          <button>+</button>
        </p>
        <p>
          <button>加入购物车</button>
        </p>
        <p class="explan">服务说明：72小时发货7天无理由退货延误必赔退货补运费全国包邮</p>
      </div>
    </div>

    <div class="info container">
      商品介绍信息
    </div>
  </div>




  <div class="blank"></div>
  <div class="footer">
    <div class="banner">
      <!-- <img src="../images/mogu.png" alt=""> -->
      <div class="logo">
        <div>
          <img src="https://s10.mogucdn.com/mlcdn/c45406/181112_4a8ch8fac2i12ib313hif4da35ed3_280x76.png">
        </div>
      </div>

      <!-- 新手帮助，保障权限 -->
      <div class="footer_help">
        <div>
          <div class="footer_help_title">
            新手帮助
            <p></p>
          </div>
          <ul>
            <li>常见问题</li>
            <li>自助服务</li>
            <li>联系客服</li>
            <li>意见反馈</li>
          </ul>
        </div>
        <div>
          <div class="footer_help_title">
            权益保障
            <p></p>
          </div>
          <ul>
            <li>全国包邮</li>
            <li>七天无理由退货</li>
            <li>退货运费补贴</li>
            <li>限时发货</li>
          </ul>
        </div>
        <div>
          <div class="footer_help_title">
            支付方式
            <p></p>
          </div>
          <ul>
            <li>支付宝支付</li>
            <li>微信支付</li>
            <li>白富美支付</li>
          </ul>
        </div>
        <div>
          <div class="footer_help_title">
            移动客户端下载
            <p></p>
          </div>
          <ul class="scan">
            <li>蘑菇街<img src="../images/4.jpg" alt=""></li>
            <li>美丽说<img src="../images/4.jpg" alt=""></li>
            <li>uni引力<img src="../images/5.jpg" alt=""></li>
          </ul>
        </div>
      </div>

      <!-- 关于我们 -->
      <div class="footer_msg">
        <ul>
          <li>关于我们</li>
          <li>招聘信息</li>
          <li>联系我们</li>
          <li>商家入驻</li>
          <li>商家后台</li>
          <li>规则中心</li>
          <li>规则众议院</li>
          <li>有害信息举报</li>
          <li>用户隐私保护</li>
        </ul>
      </div>
      <!-- 公司版权 -->
      <div class="mgj_footer_hostname">
        <span>
          ©2020 Mogu.com 杭州卷瓜网络有限公司
        </span>
      </div>
      <!-- 营业执照 -->
      <div class="footer_copyright">

      </div>

    </div>
  </div>
  <!-- 公共尾部结束 -->

























  <script src="../js/jquery.min.js"></script>

  <script src="../js/utils.js"></script>
  <script src="../js/public.js"></script>
  <script src="../js/detail.js"></script>







</body>

</html>